<style lang='scss' scoped>
@import '@css/style.scss';
.search{
    background-color: #fff;
    width: 100%;
    margin: px2rem(6);
    border-radius: px2rem(22);
    display: flex;
    align-items: center;
    &-icon{
        margin-left:$marginSize;
        width: px2rem(16);
    }
    &-hint{
        margin-left:$marginSize;
        font-size: $minInfoSize;
        color:$lineColor;
    }
}
</style>
<template>
  <div class="search" :style="{backgroundColor:bgColor}">
    <img class="search-icon" :src="icon" alt="">
    <span class="search-hint" :style="{color:hintColor}">搜索商品信息</span>
  </div>
</template>
<script>
export default {
    props: {
        //图标
        icon: {
            type: String,
            default:require('@img/search.svg')
        },
        //字体颜色
        hintColor:{
            type:String,
            default:'#999'
        },
        //背景颜色
        bgColor:{
            type:String,
            default:'#fff'
        }
    },
  data() {
    return {
      
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    init() {
      
    }
  },
  computed: {
    
  }
}
</script>